<template>
	<div>
		<count-to ref="countTo" :end-val="endVal" @on-animation-end="handleEnd">
			<span slot="left">总金额：</span>
			<span slot="right"> 元</span>
		</count-to>
		<button @click="getNumber">获取数值</button>
		<button @click="update">更新数值</button>
	</div>
</template>


<script>
	import CountTo from '@/components/count-to';

	export default {
		name: "Count-to",
		components: {CountTo},
		data() {
			return {endVal: 100}
		},
		methods:{
			/**
			 * 获取数值
			 */
			getNumber() {
				this.$refs.countTo.getCount();
			},
			/**
			 * 更新数值
			 */
			update() {
				this.endVal += Math.random() * 100;
			},
			handleEnd(endVal) {
				console.log('end->',endVal);
			}
		}
	}
</script>

<style scoped>

</style>
